Skip to main content

Verifying the User’s Email

After the user creates the wallet and inputs their email, they will receive a verification email. The One37ID SDK simplifies this with the startEmailVerificationFlow() function, which sends a verification email to the user.

The user clicks the link in the email to verify, which then triggers a callback. This callback automatically navigates the user to the home screen upon successful verification.

Adding the Credential Offer Callback

In the initializeAgent function from earlier, we’ll add a handler to respond to this email verification.

Now, in the agent initialization:

const callbackHandlers = {
credentialOfferCallback: async (model) => {
console.debug("Accept credential approved", JSON.stringify(model));
// Here we are accepting the credential offer by default, we can then navigate to the home screen for example
return {
action: CredentialOfferCallbackAction.Accept,
};
// You can then navigate to the tab screen
},
onMessageReceivedCallback: async (notifications: Notification[]) => {
console.log("onMessageReceivedCallback:", notifications);
// Ensure agentInstance is initialized
if (!agentInstance) {
console.error("Agent is not initialized");
return false;
}
notifications.forEach(async (notification) => {
try {
const result = await agentInstance.notificationManager?.process(
notification.id
);
console.log(
"Processed notification:",
notification.id,
"Result:",
result
);
} catch (error) {
console.error(
`Error processing notification ${notification.id}:`,
error
);
}
});
return true;
},
};

What’s happening here?

  • Email Verification: The user is verified via the email link, and when the credential offer is received, we check the email address, accept the offer, and navigate to the home screen.

Once the email is verified and the credential offer is accepted, the app navigates the user to the HomeScreen, where they can start using the app.

Example code to navigate to the home screen:

import React from "react";
import { View, Text } from "react-native";

const HomeScreen = () => {
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Welcome to One37ID!</Text>
</View>
);
};

export default HomeScreen;

By following these steps, you've now created a simple app that allows users to:

  1. Create a wallet and verify their email.
  2. Handle credential offers using the One37ID SDK.
  3. Automatically navigate to the home screen after successful email verification.
X

Graph View